(function(global, factory) {
  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('jquery')) :
    typeof define === 'function' && define.amd ? define(['jquery'], factory) :
    global.drag = factory($);
}(this, function($) {
  'use strict';

  return function(elem, cb, anchorElem) {
    var $box = $(elem)
    var $anchor = $(anchorElem || elem)
    $(document).mousemove(function(e) {
      $anchor[0].setCapture && $anchor[0].setCapture();//低版本IE阻止默认事件，取消文字选中  
      
      if (!!this.move) {
        console.log(2, Date.now())
        var posix = !document.move_target ? { 'x': 0, 'y': 0 } : document.move_target.posix,
          callback = document.call_down || function() {
            $(this.move_target).css({
              'top': e.pageY - posix.y,
              'left': e.pageX - posix.x,
              'position': 'fixed', //防止外层有relative
              'z-index': 1
            });
          };

        callback.call(this, e, posix);
      }
    }).mouseup(function(e) {

      $anchor[0].releaseCapture && $anchor[0].releaseCapture();//低版本IE取消阻止默认事件

      if (!!this.move) {
        var callback = document.call_up || function() {};
        callback.call(this, e);
        $.extend(this, {
          'move': false,
          'move_target': null,
          'call_down': false,
          'call_up': false
        });
        cb();
      }
    });

    $anchor.mousedown(function(e) {
      e.preventDefault();//阻止默认事件，取消文字选中,因为选中事件会阻塞响应move事件

      var target = $box[0]
      
      var offset = $(target).offset();

      target.posix = { 'x': e.pageX - offset.left, 'y': e.pageY - offset.top };

      //更高级的写法是mousedown时才绑定move事件，up时移除：这样不需要额外的变量
      $.extend(document, { 'move': true, 'move_target': target });
    })
    
    $box.append('<div class="coor">')
    //.css('position', 'relative')
    .on('mousedown', '.coor', function(e) {

      e.preventDefault();//阻止默认事件，取消文字选中,因为选中事件会阻塞响应move事件
      
      var posix = {
        'w': $box.width(),
        'h': $box.height(),
        'x': e.pageX,
        'y': e.pageY
      };

      $.extend(document, {
        'move': true,
        'call_down': function(e) {
          $box.css({
            'width': Math.max(30, e.pageX - posix.x + posix.w),
            'height': Math.max(30, e.pageY - posix.y + posix.h)
          });
        }
      });
      return false;
    });
  }

}))
